<style scoped>

</style>
<style>

.now-data-myself {
    width: 40%;
    position: absolute;
    border-right: 1px solid rgba(227, 227, 227, 0.6);
}

.con {
    position: relative;
    max-width: 280px;
    margin: auto;
}

.con .wh_content_all {
    background: transparent !important;
}

.wh_top_changge li {
    color: #F56C6C !important;
    font-size: 15px !important;
}

.wh_content_item, .wh_content_item_tag {
    color: #303133 !important;
}

.wh_content_item .wh_isToday {
    background: rgb(102, 177, 255) !important;
    color: #fff !important;
}

.wh_content_item .wh_chose_day {
    background: #409EFF !important;
    color: #ffff !important;
}

.wh_item_date:hover {
    background: rgb(217, 236, 255) !important;
    border-radius: 100px !important;
    color: rgb(102, 177, 255) !important;
}

.wh_jiantou1[data-v-2ebcbc83] {
    border-top: 2px solid #909399;
    border-left: 2px solid #909399;
    width: 7px;
    height: 7px;
}

.wh_jiantou2[data-v-2ebcbc83] {
    border-top: 2px solid #909399;
    border-right: 2px solid #909399;
    width: 7px;
    height: 7px;
}

.wh_top_tag[data-v-2ebcbc83] {
    color: #409EFF;
    border-top: 1px solid rgba(227, 227, 227, 0.6);
    border-bottom: 1px solid rgba(227, 227, 227, 0.6);
}

.wh_container[data-v-2ebcbc83] {
    max-width: 280px;
}

.wh_top_changge[data-v-2ebcbc83] {
    display: flex;
}

.now-data-myself-time {
    color: #F56C6C;
    font-size: 28px;
    height: 30px;
    font-family: "Helvetica Neue";
}

.now-data-myself-week {
    font-size: 10px;
    color: #909399;
}

.wh_top_changge .wh_content_li[data-v-2ebcbc83] {
    font-family: Helvetica;
}

.wh_content_item > .wh_isMark {
    background: #F56C6C !important;
}

</style>
<template>
    <div>
        <div class="top-title bg-white">
            <div class="top-title-text text-18 black blod">电子围栏</div>
        </div>
        <div class="page-content flex-column" style="height: calc(100% - 50px);">
            <div class="search-block bg-white p-20">
                <Form inline :label-width="90">
                    <FormItem label="姓名/手机号">
                        <!--<Input v-model="search.str" class="w240" type="text" placeholder="请输入名称或联系方式"/>-->
                        <Select v-model="search.str" class="w240" placeholder="请选择" filterable clearable transfer>
                            <Option v-for="(item,i) in userList"
                                    :key="i"
                                    :value="item.user_name"
                            >{{ item.user_name }}-{{ item.phone_num }}
                            </Option>
                        </Select>
                    </FormItem>
                    <!--<FormItem label=" " :label-width="20">-->
                    <!--<Select v-model="search.progress" class="w160"placeholder="方案" clearable>-->
                    <!--<Option value="1">已制定方案</Option>-->
                    <!--<Option value="2">未制定方案</Option>-->
                    <!--</Select>-->
                    <!--</FormItem>-->
                    <FormItem :label-width="0">
                        <Button @click="showItemLine" class="m-r-10" type="primary">搜索</Button>
                        <!--<Button @click="reset">重置</Button>-->
                    </FormItem>


                    <!--<FormItem :label-width="0">-->
                    <!--<Button v-show="!editing" @click="addPolygon" class="m-r-10" type="primary"><img src="assets/image/add.png">新增围栏</Button>-->
                    <!--<Button v-show="editing" @click="finishEdit" class="m-r-10" type="success">完成围栏区域编辑</Button>-->
                    <!--</FormItem>-->
                </Form>
            </div>

            <div class="content-block bg-white p-0-20 flex-1 flex-column">

                <div id="mainContent" class="flex-1-height">
                    <div id="mapBox" style="width:100%;height:98%"></div>
                </div>

            </div>
            <Drawer :closable="false" :mask="false" width="400" v-model="infoModal">
                <p class="h100 t-c text-24 blod">电子围栏考勤信息</p>
                <div>
                    <Row class="p-10">
                        <Col span="12" class="text-14 blod">
                            围栏名称：
                        </Col>
                        <Col span="12" class="text-14 blod">
                            {{ infoData.wl_mc }}
                        </Col>
                    </Row>
                    <Row class="p-10">
                        <Col span="12" class="text-14 blod">
                            负责人：
                        </Col>
                        <Col span="12" class="text-14 blod">
                            {{ infoData.wl_fzr }}
                        </Col>
                    </Row>
                </div>
                <Divider/>
                <div>
                    <Row class="p-10">
                        <Col span="12" class="text-14 blod">
                            班次01
                        </Col>
                        <Col span="12" class="text-14 blod">
                        </Col>
                    </Row>
                    <Row class="p-10">
                        <Col span="8" class="text-14 blod">
                            应到：23人
                        </Col>
                        <Col span="8" class="text-14 blod">
                            实到：22人
                        </Col>
                        <Col span="8" class="text-14 blod">
                            请假：1人
                        </Col>
                    </Row>
                </div>
                <Divider/>
                <div>
                    <Row class="p-10">
                        <Col span="12" class="text-14 blod">
                            班次02
                        </Col>
                        <Col span="12" class="text-14 blod">
                        </Col>
                    </Row>
                    <Row class="p-10">
                        <Col span="8" class="text-14 blod">
                            应到：20人
                        </Col>
                        <Col span="8" class="text-14 blod">
                            实到：18人
                        </Col>
                        <Col span="8" class="text-14 blod">
                            请假：2人
                        </Col>
                    </Row>
                </div>

                <div class="p-10">
                    <Button @click="showItemModal" class="m-r-20" type="primary">详情</Button>
                    <Button @click="infoModal = false">关闭</Button>
                </div>

            </Drawer>
        </div>


        <Modal v-model="itemModal"
               title="考勤详情"
               class-name="vertical-center-modal"
               width="1000"
        >
            <div class="p-l-20 max-h550">
                <div class="top-title-text text-18 black blod">基础信息</div>
                <div class=" max-h500">

                    <div class="p-10">

                        <div class="flex h30 m-b-10">

                            <div class="flex w30p">
                                <div class="gray w80">围栏名称：</div>
                                <div class="flex-1">{{ itemData.wl_mc }}</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">负责人：</div>
                                <div class="flex-1">{{ itemData.wl_fzr }}</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">联系方式：</div>
                                <div class="flex-1">{{ itemData.wl_fzr }}</div>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="top-title-text text-18 black blod">考勤信息</div>
                <div class="" style="height:500px;overflow: auto">
                    <div class="search-block bg-white p-15-0">
                        <Form inline :label-width="20">
                            <FormItem label=" ">
                                <Input v-model="search.str" class="w160" type="text" placeholder="名称/联系方式"/>
                            </FormItem>

                            <FormItem label=" " :label-width="20">
                                <DatePicker :value="new Date()" class="w160" type="date"
                                            split-panels placeholder="选择日期" clearable></DatePicker>
                            </FormItem>
                            <FormItem :label-width="0">
                                <Button @click="goSearch" class="m-r-10" type="primary">搜索</Button>
                                <Button @click="reset">重置</Button>
                            </FormItem>
                        </Form>
                    </div>

                    <div class="p-0-10">

                        <div class="m-b-10 h30 w60p flex-c-c">
                            <div class="flex-1"><span class="red">*</span>应到：52人</div>
                            <div class="flex-1"><span class="red">*</span>实到：48人</div>
                            <div class="flex-1"><span class="red">*</span>请假：2人</div>
                            <div class="flex-1"><span class="red">*</span>迟到：5人</div>
                            <div class="flex-1"><span class="red">*</span>旷工：2人</div>

                        </div>
                        <Table :columns="columns"
                               :data="banciList"
                        >
                        </Table>

                    </div>


                </div>
            </div>

        </Modal>


        <Modal v-model="detailModal"
               title="查看"
               class-name="vertical-center-modal"
               width="800"
        >
            <div class="p-l-20 max-h550">
                <div class="top-title-text text-18 black blod">基础信息</div>
                <div class=" max-h500">

                    <div class="p-20">

                        <div class="flex h30 m-b-20">

                            <div class="flex w30p">
                                <div class="gray w80">人员姓名：</div>
                                <div class="flex-1">{{ detail.user_name }}</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">性别：</div>
                                <div class="flex-1">男</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">岗位：</div>
                                <div class="flex-1">环卫</div>
                            </div>
                        </div>

                        <div class="flex h30 m-b-20">

                            <div class="flex w30p">
                                <div class="gray w80">手机号码：</div>
                                <div class="flex-1">{{ detail.phone_num }}</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w100">紧急联系人：</div>
                                <div class="flex-1">----</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">联系人号码：</div>
                                <div class="flex-1">----</div>
                            </div>
                        </div>

                        <div class="flex h30 m-b-20">

                            <div class="flex w30p">
                                <div class="gray w80">所属机构：</div>
                                <div class="flex-1">环保部</div>
                            </div>
                            <div class="flex w30p">
                                <div class="gray w80">考勤区域：</div>
                                <div class="flex-1">考勤01</div>
                            </div>
                        </div>
                    </div>
                </div>


                <div class="top-title-text text-18 black blod">考勤信息</div>
                <div class="" style="height: 400px">

                    <div class="p-20 flex">
                        <div class="flex-1 con">
                            <Calendar
                                v-on:choseDay="clickDay"
                                v-on:changeMonth="changeDate"
                                v-on:isToday="clickToday"
                                :markDate="markDate"
                            >

                            </Calendar>
                        </div>
                        <div class="flex-1">

                            <div class="p-15">
                                <div class="flex-c h30">
                                    <div class="flex-1 blod">4月:</div>
                                    <div class="flex-1">迟到：2次</div>
                                    <div class="flex-1">事假：2次</div>
                                    <div class="flex-1">旷工：2次</div>
                                </div>

                                <div class="p-10-0">

                                    <div class="flex-c h30">
                                        <div class="flex-1 blod">21日:</div>
                                        <div class="flex-1">请假2天</div>
                                        <div class="flex-1"></div>
                                        <div class="flex-1"></div>
                                    </div>
                                    <div class="flex-c h30">
                                        <div class="flex-1">09:14 申请请假</div>
                                        <div class="flex-1">14:00 王二小审批通过</div>
                                    </div>
                                </div>

                                <div class="p-10-0">

                                    <div class="flex-c h30">
                                        <div class="flex-1 blod">24日:</div>
                                        <div class="flex-1">请假2天</div>
                                        <div class="flex-1"></div>
                                        <div class="flex-1"></div>
                                    </div>
                                    <div class="flex-c h30">
                                        <div class="flex-1">09:14 申请请假</div>
                                        <div class="flex-1">14:00 王二小审批通过</div>
                                    </div>

                                </div>
                            </div>

                        </div>

                    </div>

                </div>
            </div>

            <div slot="footer">
                <Button @click="detailModal = false" class="m-r-10">取消</Button>
                <Button @click="showItemLine" type="primary">查看轨迹</Button>
            </div>
        </Modal>


        <Modal v-model="lineModal"
               :title="currentDate + ' 手环轨迹'"
               class-name="vertical-center-modal"
               width="1200"
        >
            <div style="height: 650px;width:100%;">
                <div v-if="lineModal" style="width: 100%;height:100%" id="lineBox">

                </div>
            </div>

            <div slot="footer">
                <!--<Button type="primary">关闭</Button>-->
            </div>

        </Modal>

    </div>
</template>

<script>

    var map
    var mouseTool
    var polyEditor

    let defaultOpt = {
        strokeColor: "#55f",
        strokeWeight: 6,
        strokeOpacity: 0.2,
        fillColor: '#1791fc',
        fillOpacity: 0.6,
        strokeStyle: "solid",
        cursor: 'pointer',
    };

    let editOpt = {
        strokeColor: "#1791fc",
        strokeWeight: 6,
        strokeOpacity: 0.2,
        fillColor: '#ff5555',
        fillOpacity: 0.6,
        strokeStyle: "solid",
        cursor: 'pointer',
    };

    import Calendar from 'vue-calendar-component';


    let lineMap;

    export default {
        components: {
            Calendar
        },
        data() {
            return {

                search: {
                    str: '',
                    timeArr: [],
                },
                total: 0,
                page: 1,
                pageSize: 10,

                userList: [],
                list: [],

                tableHeight: 500,

                columns: [
                    {
                        title: '班次',
                        key: 'bc',
                    },
                    {
                        title: '人员',
                        key: 'user_name'
                    },
                    {
                        title: '联系方式',
                        key: 'user_account'
                    },
                    // {
                    //     title: '状态',
                    //     key: 'zt',
                    //     width: 100,
                    // },
                    {
                        title: '打卡时间',
                        key: 'dksj',
                        key: 'in_time',
                        // sortable: 'custom'
                    },
                    {
                        title: '操作',
                        render: (h, params) => {
                            let look = h('a', {
                                class: 'm-r-10',
                                on: {
                                    click: () => {
                                        console.log('查看', params.row);
                                        this.showDetailModal(params.row.imei || params.row.iemi);
                                    }
                                }
                            }, '查看');
                            let edit = h('a', {
                                class: 'm-r-10',
                                on: {
                                    click: () => {
                                        console.log('编辑', params.row);
                                        this.showItemLine(params.row);
                                    }
                                }
                            }, '轨迹');
                            return h('div', [look,]);
                        }
                    },
                ],
                banciList: [
                    {
                        bc: '班次1',
                        mc: '黄良仙',
                        lx: '15296783113',
                        imei: '863659048822117',
                        zt: '正常',
                        dksj: moment().format('YYYY.MM.DD') + ' 07:51',
                    },
                    {
                        bc: '班次2',
                        mc: '胡勺勺',
                        lx: '13028004550',
                        imei: '2343243238',
                        zt: '迟到',
                        dksj: moment().format('YYYY.MM.DD') + ' 08:16',
                    },
                ],

                itemModal: false,
                itemData: {
                    "wl_mc": "",
                    "wl_fzr": "",
                    "wl_zbd": "",
                },

                currentPolygon: '',

                editing: false,

                infoModal: false,
                infoData: '',

                detailModal: false,
                detail: {},
                markDate: [
                    '2023/3/19',
                    '2023/3/18',
                    '2023/3/16',
                ],

                lineModal: false,

                currentDate: moment().format('YYYY-MM-DD'),
                // currentDate: '2023-03-24',
            }
        },
        created() {
            this.getUserList();
        },
        mounted() {
            let mainContent = document.getElementById('mainContent')
            if (mainContent) {
                this.tableHeight = mainContent.offsetHeight - 40
            }
            this.timer = setInterval(() => {
                if (mainContent) {
                    this.tableHeight = mainContent.offsetHeight - 40
                } else {
                    mainContent = document.getElementById('mainContent')
                }
            }, 1000)


            this.initMap()
        },
        beforeDestroy() {
            clearInterval(this.timer);
        },
        methods: {
            getUserList() {

                let postData = {
                    // orId: this.detailId,
                };
                this.util.get('/hand/userAccountLists', postData).then(res => {
                    console.log('获取机构人员', JSON.parse(JSON.stringify(res)))
                    res.data && res.data.forEach(v => {
                        v.state = v.status === 'T'
                    })
                    this.userList = res.data || []
                })
            },

            getPointList() {

                let postData = {
                    imei: '863659048822117',
                };
                this.util.get('/hand/currentLocationInf', postData).then(res => {
                    console.log('获取手环定位1', JSON.parse(JSON.stringify(res)))
                    if (res.data.longitude) {
                        this.createMarker(res.data)
                    }
                })

                postData = {
                    imei: '2343243238',
                };
                this.util.get('/hand/currentLocationInf', postData).then(res => {
                    console.log('获取手环定位2', JSON.parse(JSON.stringify(res)))
                    if (res.data.longitude) {
                        this.createMarker(res.data)
                    }

                })
            },

            clickDay(data) {
                console.log(data); //选中某天

                let dateArr = data.split('/')
                this.currentDate = dateArr[0] + '-' + dateArr[1] + '-' + dateArr[2]

            },
            changeDate(data) {
                console.log(data); //左右点击切换月份
            },
            clickToday(data) {
                // console.log(data); // 跳到了本月
            },

            initMap() {


                map = new AMap.Map("mapBox", {
                    center: [111.006536, 35.026872],
                    zoom: 14,
                    doubleClickZoom: false,
                });

                setTimeout(() => {
                    this.getList();
                    this.getPointList()
                }, 1000)

            },


            goSearch() {
                this.onPageChange(1)
            },

            reset() {
                this.search = {
                    str: '',
                    timeArr: [],
                };
                this.goSearch();
            },

            getList() {
                map.clearMap();

                let postData = {};

                this.util.get('/hand/wlLists', postData).then(res => {
                    console.log('获取围栏列表', JSON.parse(JSON.stringify(res)))
                    this.list = res.data || [];
                    this.total = res.total || 0;

                    // let list = [
                    //     {
                    //         wl_mc: '考勤1',
                    //         wl_zbd: [[116.35764,39.904834],[116.341933,39.890611],[116.367425,39.876911],[116.378583,39.889557]]
                    //     },
                    //     {
                    //         wl_mc: '考勤2',
                    //         wl_zbd: [[116.411387,39.88334],[116.421086,39.89638],[116.436964,39.880376],[116.424519,39.874712]]
                    //     },
                    // ];

                    this.list.forEach(v => {
                        try {
                            v.wl_zbd = JSON.parse(v.wl_zbd)
                            if (Array.isArray(v.wl_zbd)) {
                                this.createPolygon(v);
                            }
                        } catch (err) {
                            // console.log('绘制错误', err);
                        }
                    })


                    // 区域外坐标
                    let markers = [{"longitude": 111.002542, "latitude": 35.024558}, {
                        "longitude": 111.002153,
                        "latitude": 35.022442
                    }, {"longitude": 111.003109, "latitude": 35.023384}]

                    // 区域内坐标
                    //     [{"longitude":111.008914,"latitude":35.026732},{"longitude":111.007905,"latitude":35.024833},{"longitude":111.010365,"latitude":35.024746}]


                    // let markers = [[111.0034,40.037481],[110.998363,40.032763],[111.004881,40.028724],[111.010452,40.032808],[111.007607,40.035621]];
                    // let markers2 = [[111.034865,40.032853],[111.024673,40.027409],[111.032969,40.024187],[111.041028,40.027046]];
                    // markers.forEach(this.createMarker)
                    // markers2.forEach(this.createMarker)
                })
            },
            createMarker(item) {
                console.log('item', item)
                var marker = new AMap.Marker({
                    icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
                    position: [item.longitude, item.latitude],
                    anchor: 'bottom-center'
                });
                marker.Data = item;
                map.add(marker);

                marker.on('click', this.handleMarkerClick);

            },

            createPolygon(item, mapObj) {

                if (!item.wl_zbd) {
                    return;
                }

                var polygon = new AMap.Polygon({
                    path: item.wl_zbd.map(v => {
                        return [v.longitude || v[0], v.latitude || v[1]]
                    }),
                    ...defaultOpt
                });

                let lnglat = polygon.getBounds().getCenter()
                // console.log('中心', [lnglat.lng,lnglat.lat])


                var text = new AMap.Text({
                    text: item.wl_mc,
                    anchor: 'center', // 设置文本标记锚点
                    style: {
                        'text-align': 'center',
                        'font-size': '20px',
                        'color': 'white',
                        'background-color': 'transparent',
                        'border-width': 0,

                        // 'padding': '.75rem 1.25rem',
                        // 'margin-bottom': '1rem',
                        // 'border-radius': '.25rem',
                        // 'background-color': 'white',
                        // 'width': '15rem',
                        // 'border-width': 0,
                        // 'box-shadow': '0 2px 6px 0 rgba(114, 124, 245, .5)',
                        'text-align': 'center',
                        'font-size': '20px',
                        'color': 'white'
                    },
                    position: [lnglat.lng, lnglat.lat],
                });

                polygon.Data = item;
                polygon.Text = text;
                item.polygon = polygon;

                console.log('mapObj', mapObj)
                if (mapObj) {
                    console.log('mapObj2', mapObj)
                    mapObj.add([polygon, text])
                    mapObj.setFitView();
                } else {
                    polygon.on('click', this.handleShowPolygon);
                    map.add([polygon, text])
                    map.setFitView();
                }
            },
            createPolyline(item, mapObj) {
                let path = item.path.map(v => [v.longitude, v.latitude]);
                var polyline = new AMap.Polyline({
                    path: path,
                    isOutline: true,
                    outlineColor: '#ffeeff',
                    borderWeight: 3,
                    strokeColor: '#3366FF',
                    strokeOpacity: 1,
                    strokeWeight: 6,
                    showDir: true,
                    strokeStyle: "solid",
                    strokeDasharray: [10, 5],
                    lineJoin: 'round',
                    lineCap: 'round',
                    zIndex: 50,
                })
                mapObj.add(polyline)
                mapObj.setFitView();
            },
            handleShowPolygon(e) {
                console.log('点击区域', e);
                let polygon = e.target;

                if (polygon.Data) {

                    if (this.currentPolygon) {
                        this.currentPolygon.setOptions({
                            ...defaultOpt
                        })
                    }

                    this.currentPolygon = polygon;
                    this.currentPolygon.setOptions({
                        ...editOpt
                    })

                    // polyEditor = new AMap.PolygonEditor(map, this.currentPolygon);
                    // polyEditor.open();
                    // this.editing = true;
                    this.itemData = polygon.Data;

                    //显示简单信息
                    // this.itemModal = true;

                    this.infoData = polygon.Data;
                    this.infoModal = true;
                }
            },

            handleMarkerClick(e) {
                console.log('点击点', e);
                let marker = e.target;
                if (marker.Data) {

                    this.showDetailModal(marker.Data.imei || marker.Data.iemi);

                }
            },
            showDetailModal(imei) {

                //获取详情
                let postData = {
                    imei,
                };
                this.util.get('/hand/daka', postData).then(res => {
                    console.log('获取手环详情', JSON.parse(JSON.stringify(res)))
                    if (res.data.user) {
                        this.detail = res.data.user;
                        this.detail.imei = imei;
                        this.detailModal = true;
                    } else {
                        this.$Message.warning('获取定位详情失败')
                    }
                })
            },

            showItemModal() {

                this.itemData = this.infoData;

                //获取考勤详细信息

                let postData = {
                    dzwl_id: this.itemData.id,
                };
                this.util.get('/hand/dzwl_dk', postData).then(res => {
                    console.log('获取区域考勤详情', JSON.parse(JSON.stringify(res)))
                    if (res.data) {
                        this.itemData = res.data.dzwl;
                        res.data.daka && res.data.daka.forEach(v => {
                            v.bc = "班次一"
                        })
                        this.banciList = res.data.daka || [];

                        this.itemModal = true;
                    } else {
                        this.$Message.warning('获取区域考勤详情失败')
                    }
                })


            },

            showItemLine() {

                this.lineModal = true;

                setTimeout(() => {

                    lineMap = new AMap.Map("lineBox", {
                        center: [111.017907, 40.031257],
                        zoom: 14,
                        doubleClickZoom: false,
                    });
                    console.log('lineMap', lineMap)


                    setTimeout(async () => {
                        console.log('绘制区域')
                        let list = this.list.map(v => {
                            return {
                                wl_mc: v.wl_mc,
                                wl_zbd: v.wl_zbd,
                            }
                        })

                        console.log('list', list);
                        this.createPolygon(list[0], lineMap);

                        console.log('绘制轨迹')

                        let lines = await this.getLine();

                        lines.forEach(line => {
                            this.createPolyline(line, lineMap)
                        })

                        // let line = [[111.002156,40.041337],[111.001504,40.039023],[110.99943,40.036619],[110.99866,40.030948],[110.999608,40.029405],[111.003756,40.028452],[111.005948,40.027046],[111.0098,40.02573],[111.011459,40.02759],[111.005474,40.028951],[111.001563,40.030585],[111.001504,40.034305],[111.001385,40.036846],[111.002985,40.038071],[111.002807,40.040611],[111.003637,40.040747]];
                        // this.createPolyline(line, lineMap)
                    }, 500)
                }, 500)
            },

            getLine() {
                return new Promise(resolve => {
                    let date = this.currentDate || '2023-03-24'
                    this.util.get(`/hand/locationInf?search_date=${date}&imei=${this.detail.imei}`).then(res => {
                        console.log('获取到的路径数据', res)
                        if (res.data && res.data.length) {
                            let list = res.data
                            let paths = []
                            list.forEach(v => {
                                let item = paths.find(val => val.imei == v.imei)
                                if (item) {
                                    item.path.push({
                                        latitude: v.latitude,
                                        longitude: v.longitude,
                                    })
                                } else {
                                    paths.push({
                                        imei: v.imei,
                                        path: [{
                                            latitude: v.latitude,
                                            longitude: v.longitude,
                                        }]
                                    })
                                }
                            })
                            console.log('路径汇总', paths);

                            resolve(paths)
                        } else {
                            this.$Message.warning('未获取到日期 ' + date + ' 的路径数据')
                            resolve('')
                        }
                    })
                })
                return new Promise(resolve => {
                    let date = this.currentDate || '2023-03-24'
                    this.util.get('/hand/locationInf?search_date=' + date).then(res => {
                        console.log('获取到的路径数据', res)
                        if (res.data && res.data.length) {
                            let list = res.data
                            let paths = []
                            list.forEach(v => {
                                let item = paths.find(val => val.imei == v.imei)
                                if (item) {
                                    item.path.push({
                                        latitude: v.latitude,
                                        longitude: v.longitude,
                                    })
                                } else {
                                    paths.push({
                                        imei: v.imei,
                                        path: [{
                                            latitude: v.latitude,
                                            longitude: v.longitude,
                                        }]
                                    })
                                }
                            })
                            console.log('路径汇总', paths);

                            resolve(paths)
                        } else {
                            this.$Message.warning('未获取到日期 ' + date + ' 的路径数据')
                            resolve('')
                        }
                    })
                })
            },


        },
    }
</script>

